<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>通信实例</title>
	<style type="text/css">
		.container {
			display: flex;
			flex-direction: column;
		}
		.content {
			text-align: center;
			margin: 15px 0;
		}
		#msg {
			font-size: 1.2rem;
			font-weight: bold;
			color: #ff7d00;
		}
		.text {
			text-align: center;
			color: #c5c8ce;
		}
		.btn-box {
			text-align: center;
			margin: 15px 0;
		}
		.btn-box button {
			width: 125px;
			height: 45px;
			font-size: 18px;
			color: white;
			background-color: #1989fa;
			border-color: #2b85e4;
			border-radius: 5px;
		}
		.btn-box button:active {
			background-color: #88c1fa;
			border-color: #5cadff;
		}
	</style>
</head>
<body>
	<div class="container" id="lauwen">
		<div class="content" id="msg"></div>
		<div class="content" id="send"></div>
		<div class="btn-box">
			<button type="button" onclick="webSendData()">发送消息</button>
		</div>
	</div>
	<script type="text/javascript" src="js/uni.webview.1.5.2.js"></script>
	<script type="text/javascript">
		function webReceiveData (data) {
			var parseData = JSON.parse(data)
			document.getElementById('msg').innerText = `接收到的消息：${parseData.msg}`
		}
		function webSendData () {
			document.getElementById('send').innerText = `已发送的消息：啊对对对`
			uni.postMessage({
				data: {
					msg: '啊对对对'
				}
			});
		}
	</script>
</body>
</html>